<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!---->
    <select class="province">
        <option>江西省</option>
        <option>福建省</option>
        <option>湖南省</option>
    </select>
    <select class="city">
        <option>南昌市</option>
        <option>赣州市</option>
        <option>九江市</option>
    </select>
</body>
<script>
    let data = {
        "江西省":["南昌市","赣州市","九江市"],
        "福建省":["福州市","厦门市","泉州市"],
        "湖南省":["长沙市","湘潭市","邵阳市"]
    };
    var provinceDom = document.querySelector(".province");
    var cityDom = document.querySelector(".city");

    provinceDom.onchange = function(){
        cityDom.innerHTML = "";
        for(var i = 0;i<data[provinceDom.value].length;i++){

            var createOption = document.createElement("option");
            createOption.text = data[provinceDom.value][i];
            cityDom.appendChild(createOption);

        }
    };
</script>
</html>